<template>
  <div class="_wrapper-y _box-scroll _over-scroll-hidden">
    <div class="_flex _flex-start _flex-space-x">
      <el-radio-group v-model="cn">
        <el-radio :label="undefined">全部</el-radio>
        <el-radio :label="2011">实时</el-radio>
        <el-radio :label="2051">分钟</el-radio>
        <el-radio :label="2061">小时</el-radio>
      </el-radio-group>
      <el-button class="_m-l-10" type="primary" size="small" @click="initData()"
        >查询</el-button
      >
    </div>
    <div v-loading="loading" class="_flex-item-1">
      <div
        v-for="item in dataList"
        :key="item.id"
        class="_cart _m-b-5 _p5 _flex"
      >
        <div class="_font _font-title" style="width: 260px">
          <div>{{ $tool.dateStr(item.report_time) }}({{ cnMap[item.cn] }})</div>
        </div>
        <ComCollapse>
          <ComIotDeviceDataView :comCode="item.id"></ComIotDeviceDataView>
        </ComCollapse>
      </div>
    </div>
  </div>
</template>
<script>
import toolAction from "@/tool/http/tool-action";
import ComCollapse from "@/components/com-collapse/com-collapse.vue";
import ComIotDeviceDataView from "./com-iot-device-data-view.vue";

let thingsDeviceDataApi = toolAction.init("things_device_data");

export default {
  components: { ComCollapse, ComIotDeviceDataView },
  data() {
    return {
      dataList: [],
      cn: 2061,
      cnMap: {
        2061: "小时",
        2051: "分钟",
        2011: "实时",
      },
      loading: false,
    };
  },
  mounted() {
    this.initData();
  },
  methods: {
    initData() {
      let rules = {
        device_code__eq: this.comCode,
      };
      if (this.cn) {
        rules.cn__eq = this.cn;
      }
      this.loading = true;
      thingsDeviceDataApi
        .page({
          rules,
        })
        .then((res) => {
          this.dataList = res.records;
          this.loading = false;
        });
    },
  },
};
</script>
<style></style>
